<span [class.text-danger]="!canBuy">
  <clr-signpost>
    <span clrSignpostTrigger>
      <clr-icon
        size="24"
        [attr.shape]="unit.shape"
        *ngIf="unit.shape; else name"
        class="resIcon"
      ></clr-icon>
      <ng-template #name>
        {{ unit.name }}
      </ng-template>

      <app-formatted-quantity [quantity]="price"></app-formatted-quantity>
      <!-- <a [routerLink]="'/nav/unit/'+unit.id"> {{unit.name}}</a>, -->
    </span>
    <!-- <a clrSignpostTrigger> {{ unit.name }}, </a> -->
    <clr-signpost-content *clrIfOpen>
      <h3 style="margin-top: 0">
        <clr-icon
          size="24"
          [attr.shape]="unit.shape"
          *ngIf="unit.shape"
          class="resIcon"
        ></clr-icon>
        {{ unit.name }}
      </h3>
      <p>
        <span *ngIf="unit.quantity.gt(0)">
          数量:
          <span *ngIf="unit.quantity.abs().gt(0.001)" class="qta">
            <app-formatted-quantity
              [quantity]="unit.quantity"
            ></app-formatted-quantity>
          </span>
          <br />
        </span>
        <app-polynom [c]="unit.c"> </app-polynom>
      </p>
      <a [routerLink]="'/home/res/' + unit.id" class="noRed">
        前往 {{ unit.name }}
      </a>
    </clr-signpost-content>
  </clr-signpost>
</span>
